<template>
  <view>
    <!-- 公共组件-每个页面必须引入 -->
    <public-module></public-module>
		<view class="u-padding-20">
		<u--form labelPosition="left" labelWidth="80" >
			<u-form-item label="添加用户" >
				<u-input placeholder="输入员工手机号(员工需先绑定手机号)" type="text" v-model="mobile"/>
			</u-form-item>
		</u--form>
		<u-button type="primary" @click="submit_addstaff()">添加用户</u-button>
		</view>
		<view class="b-b"></view>
        <view class="base-tonglan-box u-m-b-30">
          <view class="item" v-for="(staff, index) in staffList" :key="index">
			  <view class="u-flex u-m-t-20">
					<view class="u-flex-2 u-m-r-20">
						<u--image :showLoading="true" :src="staff.userinfo.avatar_url" width="80px" height="80px"></u--image>
					</view>
					<view class="u-flex-9">
							<u--text :text="staff.userinfo.nickname"></u--text>
							<u-gap height="20"></u-gap>
							<view class="u-flex u-flex-around">
							<view>
								<u-switch v-model="staff.auth_admin"  :activeValue="1" :inactiveValue="0" size="15" @change="change(staff,'a')"></u-switch>
								管理店铺
							</view>
							<view>
								<u-switch v-model="staff.auth_checkticket"  :activeValue="1" :inactiveValue="0" size="15" @change="change(staff,'t')"></u-switch>
								核验/订单
							</view>
							<view>
								<u-switch v-model="staff.auth_onlinechat"  :activeValue="1" :inactiveValue="0" size="15" @change="change(staff,'c')"></u-switch>
								客服
							</view>
							<view>
								<u-button type="primary"  size="mini" @click="submit_staffdel(staff.staffmanage_id)">移出用户</u-button>
								
							</view>
							</view>
					</view>
			  </view>
          </view>
        </view>

	
  </view>
</template>


<script>
import { mapState, mapMutations } from "vuex";
import { api_store_staff_list,
		 api_store_staff_add,
		 api_store_staff_del,
		 api_store_staff_authmobi
		} from '@/config/api.js';
export default {
  data() {
    return {
      flow_list: [],
      hasLogin: false,
      loadStatus: "loadmore",
      loadstatus: false,
	  staffList:[],
	  mobile:''
    };
  },

	onLoad(options) {
		console.log('options',options)
			this.shop_id = options.shop_id;
			this.get_staff(this.shop_id);
	},
  methods: {
		get_staff(shop_id){
			api_store_staff_list({
				shop_id:shop_id
			}).then(res => {
				console.log(res)
				this.staffList=res
			}).catch((e)=>{});	
		},
		change(e,type){
			api_store_staff_authmobi({
				type:type,
				staffmanage_id:e.staffmanage_id
			}).then(res => {
				this.get_staff(this.shop_id);
			}).catch((e)=>{});	
		},
		submit_staffdel(staffmanage_id){
			api_store_staff_del({
				staffmanage_id:staffmanage_id
			}).then(res => {
				this.get_staff(this.shop_id);
			}).catch((e)=>{});	
		},
		submit_addstaff(){
			api_store_staff_add({
				phone:this.mobile,
				shop_id:this.shop_id
			}).then(res => {
				console.log('res',res)
				this.get_staff(this.shop_id);
			}).catch((e)=>{});	
		}
  },
};
</script>
<style lang="scss" scoped>
	.base-tonglan-box{
		.item{
			line-height: 160%;
			position: relative;
			box-sizing: border-box;
			padding: 10rpx 10rpx;
			&:after {
				position: absolute;
				z-index: 0;
				right: 0;
				bottom: 0;
				left: 0;
				height: 0.5px;
				content: '';
				-webkit-transform: scaleY(.5);
				-ms-transform: scaleY(.5);
				transform: scaleY(.5);
				background-color: #f8f8f8;
			}
			&:last-child {
				&:after{
					border-bottom: 0px;
					background-color:#FFFFFF;
					height: 0.1rpx;
				}
			}
		}
	}
</style>
